<%@ page language="java" pageEncoding="UTF-8" contentType="text/html; charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>杰钱包注册页</title>
    <meta charset="utf-8" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
    <meta name="description" content="" />
    <meta name="keywords" content="" />
	<meta http-equiv="pragma" content="no-cache"/>
	<meta http-equiv="cache-control" content="no-cache"/>
	<meta http-equiv="expires" content="0"/>
    <style type="text/css">
        /* ------------------------------------------------ 头部 ------------------------------------ */
        @media screen and (max-width: 380px) {
            html{
                font-size: 10px;
            }
        }
        @media screen and (min-width: 380px) and (max-width:500px) {
            html{
                font-size: 12px;
            }
        }
        @media screen and (min-width: 500px) and (max-width:650px) {
            html{
                font-size: 13px;
            }
        }
        @media screen and (min-width: 650px) {
            html{
                font-size: 14px;
            }
        }
        header{
            background: #30afe9;
            color: white;
            text-align: center;
            margin: 0px;
            padding: 0px;
            display: table;
            width: 100%;
        }
        header .button, .title{
            display: table-cell;
            height: 50px;
            overflow: hidden;
            margin: 0px;
            padding: 0px;
            vertical-align: middle;
        }
        header .button{
            width: 27%;
            height: 50px;
        }
        header .title{
            width: 46%;
            font-size: 1.8rem;
            margin-top: 0px;
            line-height: 50px;
        }
        header .button .back{
            overflow: hidden;
            display: table-cell;
            text-decoration: none;
            color: white;
            font-size: 1.6rem;
            padding: 2px 0px 0px 0px;
        }
        header .button .back img{
            border: none;
            width: 26px;
            height: auto;
            padding: 0px 0px 0px 10px;
            vertical-align: middle;
        }
        /* ------------------------------------------------ 头部 ------------------------------------ */
        body{
            background: #f2f2f2;
            margin: 0px;
            padding: 0px;
            font-family:"微软雅黑", Arial, helvetica,"华文黑体", "方正黑体简体";
        }
        .item{
            padding: 0px;
            margin: 0px;
            text-align: center;
            position: relative;
        }
        .item img{
            padding: 0px;
            margin: 0px auto;
            border: none;
            display: block;
            width: 100%;
        }
        .input_bar{
            margin: 0px;
            padding: 20px 0px;
            display: block;
            overflow: hidden;
            background: #f2f2f2;
        }
        .input_bar .input_row{
            margin: 0px;
            padding: 6px 16px;
            display: block;
            overflow: hidden;
        }
		 .input_bar .p_row{
            margin: 0px;
            padding: 0px 16px;
            display: block;
            overflow: hidden;
			margin-top: -10px;
        }
        .input_bar .btn_row{
            margin: 0px;
            padding: 8px 16px 12px 16px;
            display: block;
            overflow: hidden;
        }
        .input_bar .info_row{
            margin: 0px;
         /**   padding: 8px 0px;*/
            display: block;
            overflow: hidden;
            text-align: center;
            font-size: 1.5rem;
            color: black;
        }
        .input_bar .tip_row{
            margin: 0px;
            padding: 16px 0px;
            display: block;
            overflow: hidden;
            text-align: center;
            font-size: 1.2rem;
        }
        .input_bar .text_l{
            background: white;
            border: none;
            width: 97%;
            padding: 0px 0px 0px 3%;
            margin: 0px;
            height: 50px;
            font-size: 16px;
            line-height: auto;

            -moz-border-radius: 4px;
            -khtml-border-radius: 4px;
            -webkit-border-radius: 4px;
            border-radius: 4px;
        }
        .input_bar .text_s{
            background: white;
            border: none;
            width: 42%;
            margin: 0px;
            padding: 0px 0px 0px 3%;
            height: 40px;
            line-height: auto;
            font-size: 16px;

            -moz-border-radius: 4px;
            -khtml-border-radius: 4px;
            -webkit-border-radius: 4px;
            border-radius: 4px;
        }
        .input_bar .btn_l{
            border: none;
            width: 100%;
            margin: 4px 0px 6px 0px;
            padding: 0px 0px 0px 0px;
            text-align: center;
            height: 40px;
            line-height: 40px;
            font-size: 14px;

            -moz-border-radius: 4px;
            -khtml-border-radius: 4px;
            -webkit-border-radius: 4px;
            border-radius: 4px;
        }
        .input_bar .btn_s{
            border: none;
            width: 45%;
            margin: 0px;
            padding: 0px;
            text-align: center;
            height: 40px;
            line-height: 40px;
            font-size: 12px;

            -moz-border-radius: 4px;
            -khtml-border-radius: 4px;
            -webkit-border-radius: 4px;
            border-radius: 4px;
        }
        .input_bar .primary{
            background: #30afe9;
            color: white;
        }
        .input_bar .right{
            float: right;
        }
        .input_bar .left{
            float: left;
        }
        .noused{
            background: rgba(0, 0, 0, 0.3);
        }
        .check {
            vertical-align: middle;   margin: 0; margin-right: 10px;
        }
    </style>
</head>
<body>
<header>
    <div class="button"></div>
    <div class="title">杰钱包注册页</div>
    <div class="button"></div>
</header>
<div class="input_bar">
    <form name="loginInf" id="loginInf" action="#" method="post" class="ajaxForm">
        <input type="hidden" id="sup_custom_uuid" name="sup_custom_uuid" value="${sup_custom_uuid}"/>
        <input type="hidden" id="sup_login_id" name="sup_login_id" value="${sup_login_id}"/>
        <div class="input_row"><%--onpaste="return false;"--%><%--onkeyup="this.value=this.value.replace(/\D/g, '')"--%>
            <input name="login_id" type="tel" class="text_l login_id" onpaste="return false;"  id="login_id" maxlength="11" placeholder="请输入您的手机号码" />
        </div>
        <div class="input_row">
            <input name="code" type="text" class="text_s left" id="code" maxlength="8" placeholder="请输入验证码" value=""/>
            <button type="button" class="btn_s primary right" id="sendCode" >获取验证码</button>
        </div>
        <div class="input_row">
            <input name="password" type="password" class="text_l" id="pwd1" placeholder="请输入登陆密码" />
        </div>
        <div class="input_row">
            <input name="pass_word" type="password" class="text_l" id="pwd2" placeholder="请再次输入登陆密码" />
        </div>
        <div class="input_row">
            <input name="pay_pass_word" type="password" class="text_l" id="pay_pass_word" placeholder="请输入支付密码" />
        </div>
        <div class="input_row">
            <input class="check" type="checkbox"  checked ='checked' /><font color="red">*</font>我已全面阅读并了解本<a href="<c:url value='/module/http/protocol.html'/>" style="text-decoration:none">《用户协议》</a>的全部内容，我同意签署本协议并承诺严格遵守。
        </div>
        <div class="p_row">
            <p style="font-size:16px;padding: 0px 0px 0px 3%;color:#fff;background:#30afe9;height:40px;line-height:40px;" >
            	推荐人：<span>${sup_login_id}</span>
            </p>
        </div>
        <div class="info_row">
            <span>请先注册账号，然后下载APP即可直接登陆</span>
        </div>
        <div class="btn_row">
            <button class="primary btn_l" type="button" id="next_1" >注册</button>
            <button class="primary btn_l" type="button" onclick="openApp('<c:url value='/httpcommon/httpDownload.do?sup_custom_uuid=${sup_custom_uuid}'/>')">下载APP</button>
        </div>
    </form>
</div>
<!--弹出层 -->
<div class="layer-bg hide "></div>
<div class="reg_cg hide">
    <div class="layer">
        <div class="layer-top"></div>
        <div class="layer-main text-center">
            <span id="showmsg"></span>
            <div class="form-group">
               <%-- <a class="btn btn-block btn-default" href="/mobile/down/index-0.html">点击下载APP</a>--%>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript" src="${pageContext.request.contextPath}/script/jquery.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/script/jquery.form.js"></script>
<%-- <script type="text/javascript" src="${pageContext.request.contextPath}/script/layer/layer.min.js"></script> --%>
<script type="text/javascript" src="<c:url value='/script/layer/mobile/layer_mobile/layer.js'/>"></script>
<script type="text/javascript">
	var baseUrl = "${pageContext.request.contextPath}";
	function openApp(url){
		window.location.href=url;
	}

    //提交注册
    $("#next_1").click(function() {
        var login_id = $.trim($("#login_id").val());
        var pwd1 = $.trim($("#pwd1").val());
        var pwd2 = $.trim($("#pwd2").val());
        var code = $.trim($("#code").val());
        var pay_pass_word = $.trim($("#pay_pass_word").val());
        var sup_custom_uuid = $.trim($("#sup_custom_uuid").val());
        /*var sup_custom_uuid = 1;*/
        var service_type = 1;
        var tell= /^1[34578]\d{9}$/;// 手机号验证
        var pass= /^[a-zA-Z0-9]{6,}$/;// 密码必须是6位数字或者字母
        var acct = /^62\d{12,17}$/;
        var Checkbox = $("input[type='checkbox']").is(':checked');
        if (login_id == ""){
            $("#login_id").focus();
            tips('请输入手机号码');
            $("#login_id").attr('placeholder','请输入手机号码');
            return;
        }else if (login_id.length != 11) {
            $("#login_id").val("");
            $("#login_id").focus();
            tips('手机号码为11位数字');
            $("#login_id").attr('placeholder','手机号码为11位数字');
            return;
        } else if (!tell.test(login_id)) {
            $("#login_id").focus();
            tips('手机号码格式有误');
            $("#login_id").attr('placeholder','手机号码格式有误');
            return;
        }else if (!pass.test(pwd1)) {
            $("#pwd1").val("");
            $("#pwd1").focus();
            tips('登陆密码最小六位字母或者数字');
            $("#pwd1").attr('placeholder','请输入登陆密码');
            return;
        }else if (pwd2 == "") {
            $("#pwd2").focus();
            $("#pwd2").attr('placeholder','确认密码为空');
            return;
        }else if(pwd1!=pwd2){
            $("#pwd1").val("");
            $("#pwd2").val("");
            $("#pwd1").focus();
            $("#pwd1").attr('placeholder','两次输入密码不一致');
            $("#pwd2").attr('placeholder','两次输入密码不一致');
            return;
        }else if (code == "") {
            $("#code").focus();
            $("#code").attr('placeholder','验证码不能为空');
            return;
        }else if (!pass.test(pay_pass_word)) {
            $("#pay_pass_word").val("");
            $("#pay_pass_word").focus();
            tips('支付密码最小六位字母或者数字');
            $("#pay_pass_word").attr('placeholder','请输入支付密码');
            return;
        }else if (!Checkbox) {
        	tips("未同意用户使用协议");
            return false;
        }else if (!code == "") {
            var flag = false;
                $.ajax({
                async: false,
                type:"post",
                url:baseUrl+"/httpcommon/getCheckRand.do",
                data: "login_id="+login_id+"&"+"rand="+code+"&"+"service_type="+service_type,
                dataType:"json",
                success:function(data){
                    flag = data;
                },
                error: function(json) {
                	message(json.sMessage);
                }
            });
            if (flag===false) {
            	tips('验证码不正确！');
                return;
            }
        }
        login();
        /*if (login_id != "") {
            $.ajax({
                type:"post",
                url:baseUrl+"/httpcommon/getLoginId.do",
                data: "login_id="+login_id,
                dataType:"text",
                success:function(data){
                    if(data=='1'){
                        layer.alert("此手机号已经注册!");
                        return false;
                    }else{
                        login();
                    }
                },
            });
        }*/
    });
    function login() {
        var login_id = $.trim($("#login_id").val());
        var pwd1 = $.trim($("#pwd1").val());
        var pwd2 = $.trim($("#pwd2").val());
        var code = $.trim($("#code").val());
        var sup_custom_uuid = $.trim($("#sup_custom_uuid").val());
        /*var sup_custom_uuid = 1;*/
        var pay_pass_word = $.trim($("#pay_pass_word").val());
        $.ajax({
            type:"post",
            url:baseUrl+"/httpcommon/share.do",
            data: "login_id="+login_id+"&"+"pass_word="+pwd1+"&"+"rand="+code+"&"+"pay_pass_word="+pay_pass_word+"&"+"sup_custom_uuid="+sup_custom_uuid,
            dataType:"json",
            success:function(data){
                if(data.dataMap =='1'){
                    tips('推荐人不正确!');
                }else if(data.dataMap =='2'){
                    tips('机构号不存在!');
                }else {
            	message("注册成功", function(){
            		window.location = '<c:url value='/httpcommon/httpDownload.do?sup_custom_uuid=${sup_custom_uuid}'/>';
            	});
                }
            },
            error: function(json) {
//                 layer.alert(json.sMessage);
                message(json.sMessage);
            }
        });
    }
    var ShowInfo = function (info) {
        $(".text-danger").text(info);
        $(".point").removeClass("hidden");
    }
    var showInfo = function (info) {
        $("#showmsg").text(info);
        $(".layer-bg").removeClass("hide");
        $(".reg_cg").removeClass("hide");
    }
    var sec = 0;
    var Runing1 = false;
    $("#sendCode").click(function () {
        var type  = 1;
        var sup_custom_uuid = $("#sup_custom_uuid").val();
        /*var sup_custom_uuid = 1;*/
      /*  var UserName = $("#login_id").val();*/
        var UserName = $.trim($("#login_id").val());
        if(sup_custom_uuid == ""){
            /*alert("没有推荐人!");*/
            tips('没有推荐人!')
            return  ;
        }
        var isvalue = false;
        if (UserName != "") {
            $.ajax({
                type:"post",
                url:baseUrl+"/httpcommon/getLoginId.do",
                data: "login_id="+UserName,
                dataType:"json",
                success:function(data){
                    if(data==isvalue){
                    	tips("此手机号已经注册!");
                        return ;
                    }else {
                        if (!/^((\(\d{2,3}\))|(\d{3}\-))?1[3,5,8,7,4]\d{9}$/.test(UserName)) {
                        	tips("请正确填写您的手机号");
                            return false;
                        }
                        if (sec > 0) {
                        	tips("请耐心等待，不要重复发送！");
                            return false;
                        }
                        if (Runing1) {
                        	tips("正在提交，请勿重复提交！");
                            return false;
                        }
                        checkRandInf();
                    }
                },
            });
        }
/*        Runing1 = true;*/
        /*checkRandInf();*/
    });
    function checkRandInf() {
        var service_type = 1;
        var type  = 1;
        var sup_custom_uuid = $("#sup_custom_uuid").val();
        /*var sup_custom_uuid = 1;*/
        var login_id = $.trim($("#login_id").val());
        $.ajax({
            url:baseUrl+"/httpcommon/ifExistRand.do",
            data: "login_id="+login_id+"&"+"service_type="+service_type,
            success: function (data) {
                if(data == 'false'){
                	message("您发送验证码太快，请30秒以后再操作！");
                    return ;
                }else{
                    $.ajax({
                        url:baseUrl+"/httpcommon/getShareRand.do",
                        data: "phone="+login_id+"&"+"type="+type+"&"+"sup_custom_uuid="+sup_custom_uuid,
                        success: function () {
                            sec = 60;
                            SetSec();
                            tips("验证码已发送至您的手机，请及时查收！");
                        },
                        error:function(msg){
                        	message(msg);
//                             layer.alert("error="+msg);
                        }
                    });
                }
            },
            error:function(msg){
            	message(msg);
//                 layer.alert("error="+msg);
            }
        });
    }
    var SetSec = function () {
        if (sec > 0) {
            sec--;
            $("#sendCode").addClass("noused").text(sec + "秒后重试");
            setTimeout("SetSec()", 1000);
        } else {
            $("#sendCode").removeClass("noused").text("重新发送");
            Runing1 = false;
        }
    }
    
    function tips(msg){
    	layer.open({
    		content: msg, 
    		skin: 'msg', 
    		time: 2.5
   		});
    }
    
    function message(msg, fn){
    	layer.open({
    		content: msg, 
    		btn: "我知道啦",
    		shadeClose: false,
    		yes: fn
   		});
    }
</script>
</body>
</html>